<template>
  <div class="head">
    <div class="title">
      <img
        src="../../assets/logo.png"
        style="padding-right:1rem;height: 24px;"
      />{{ title }}
    </div>
    <div class="time">
      <span>{{ time }}</span>
    </div>
    <div class="head-right">
      <a-select v-model="cxvalue">
        <a-select-option
          v-for="(item, index) in cxList"
          :key="index"
          :value="item.cx"
        >
          {{ item.cxname }}
        </a-select-option>
      </a-select>
    </div>
  </div>
</template>

<script>
import { bnrQuery } from '../../api/dataApi'
export default {
  name: 'ToHead',
  data() {
    return {
      cx: '',
      cxname: '',
      cxList: [],
      cxvalue: '',
    }
  },
  props: {
    title: {
      type: String,
      default: '',
    },
    time: {
      type: String,
      default: '',
    },
  },
  mounted() {
    this.getData()
  },

  methods: {
    getData() {
      const that = this
      const header = {}
      header['report.tableid'] = 'bne_prod_chart_prodline'
      const params = {
        _params: JSON.stringify(header),
        _conditions: {},
        pageSize: 0,
        pageIndex: -1,
      }
      bnrQuery(params)
        .then((res) => {
          if (res.data && res.data.length > 0) {
            this.cxList = res.data
          }
        })
        .catch(() => {
          that.$message.error('数据请求失败，请联系管理员！')
        })
    },
    // getData(cx) {
    //   const that = this
    //   const header = {}
    //   header['report.tableid'] = 'bne_prod_chart_prodline'
    //   header['cx'] = cx
    //   const params = {
    //     _params: JSON.stringify(header),
    //     _conditions: {},
    //     pageSize: 0,
    //     pageIndex: -1,
    //   }
    //   bnrQuery(params)
    //     .then((res) => {
    //       if (res.data && res.data.length > 0) {
    //         this.cxname = res.data[0].cxname
    //       }
    //     })
    //     .catch(() => {
    //       that.$message.error('数据请求失败，请联系管理员！')
    //     })
    // },
  },
  created() {},
}
// import moment from 'moment'
</script>
<style lang="less" scoped>
.head {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 8vh;
  background: url(../../assets/header_bj.png) no-repeat;
  background-size: 100% 100%;
}
.left {
  flex: 20%;
  font-size: 1.7rem;
}
.title {
  flex: 60%;
  .px2font(26);
  color: #fff;
  padding-top: 6px;
  background-image: -webkit-linear-gradient(bottom, #1e91fc, #1efcf9);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.time {
  position: absolute;
  left: 0;
  width: 30vw;
  .px2vh(top, 40);
  .px2font(20);

  color: #ddd;
}
.head-right {
  position: absolute;
  right: 0;
  width: 30vw;
  .px2vh(top, 40);
  .px2font(20);
  color: #fff;
  .ant-select {
    width: 10vw;
  }
}
.logoy {
  /* width: 2.4rem;
  height: 1rem;
  opacity: 0.8; */

  position: absolute;
  right: 2vw;
  opacity: 0.7;
  top: 89.5vh;
  z-index: 99999;
}
.logoy img {
  height: 2rem;
  z-index: 99999;
}
</style>
